<template>
  <!-- 父子通信 -->
  <div>
    <Button @click="change">子事件</Button>
    <h2>{{ props.data }}</h2>
  </div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits } from 'vue'
// 子传父
const emit = defineEmits(['handleData'])
const change = () => {
  emit('handleData', '子', '奥迪')
}

const props = defineProps({
  data: {
    type: String,
    default: '宝马',
    required: true,
  },
})
</script>

<style>
</style>